.race-page {
		// background-color: red;
		.ul {
			width: 100%;
			display: flex;
			flex-wrap: wrap;
			.li {
				width: 60rpx;
				height: 60rpx;
				text-align: center;
				line-height: 60rpx;
				border: 1px solid #ccc;	
				margin-left: 10rpx;
				margin-top: 10rpx;
				color: #707070;
			}
			.li.active {
				background-color: #06A17E;
				border: 1px solid #06A17E;
				color: #fff;
			}
		}
	}
	
	
::-webkit-scrollbar {
	display: none;
}

.li-list.hide {
	height: 0rpx;
}

.li-list {
	width: 100%;
	padding: 0rpx 30rpx;
	box-sizing: border-box;
	transition: all .5s;
	// height: 800rpx;
	height: auto;
	max-height: 800rpx;
	overflow-y: scroll;

	.list-list-opt {
		background-color: #fff;
	}

	.item-title {
		text-align: center;
		margin-top: 10rpx;
	}

	.item-box {
		width: 100%;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		display: flex;
		font-size: 28rpx;

		.item-box-left,
		.item-box-right {
			flex-basis: 50%;
			border: 1px solid #f0f0f0;
			text-align: center;
		}
	}
}

.message {
	text-align: center;
	padding: 100rpx 0rpx;
	color: #666;
}

.race {
	padding: 20rpx 30rpx;

	.race-title {
		color: #06A17E;
		font-size: 40rpx;
		font-weight: bold;
		text-shadow: 2px 2px 2px #ccc;
	}
}

.race-list {
	margin-top: 20rpx;

	.li {
		padding: 10rpx 0rpx;
		background-color: #06A17E;
		margin-bottom: 20rpx;
		border-radius: 10rpx;
		box-shadow: 2px 2px 2px #ccc;

		.li-top {
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: flex-end;
			font-size: 40rpx;
			.red {
				color: #E71D28;
				font-weight: bold;
			}

			.blue {
				color: #3D77CB;
				font-weight: bold;
			}

			.text {
				margin: 0 10rpx;
				color: #FFF;
				font-size: 60rpx;
			}
		}

		.li-bottom {
			text-align: center;
			margin-top: 10rpx;
			color: #fff;
			font-size: 28rpx;
		}
	}
}